<template>
	<view class="container">
		<view class="header">
			<text class="iconfont icon-soushuo"></text>
			<input type="text" disabled :placeholder="hotKeyword" placeholder-class="placeholder" @tap="toSearch" />
		</view>
	</view>
</template>

<script>
	export default {
		
		props:['hotKeyword'],
		onLoad() {
			// this.getHotKeywords()
		},
		onPageScroll(e) {
			console.log(e);
		},
		methods: {
			// 获取热歌词
			// async getHotKeywords(){
			// 	const res = await this.$myRequest('/search/default')
			// 	this.hotKeyword = res.data.showKeyword
			// 	console.log(res);
			// },
			toSearch() {
				uni.navigateTo({
					url:'/pages/search/search'
				})
			}
		}
	}
</script>

<style lang="scss">
	
	.container {
		// position: fixed;
		// left: 0;
		// right: 0;
		// top: 0;
		margin: 0 20rpx;
		z-index: 999;
		.header {
			position: relative;
			height: 80rpx;
			line-height: 80rpx;
			padding: 10rpx 0;
			.icon-soushuo {
				position: absolute;
				left: 15rpx;
				font-size: 50rpx;
				color: #ccc;
			}
			input {
				flex: 1;
				background-color: #f6f6f6;
				border-radius: 40rpx;
				font-size: 36rpx;
				height: 80rpx;
				// text-align: center;
				padding-left: 80rpx;
			}
			.placeholder {
				color: #bbb;
			}
		}
	}
	
</style>




